<!-- 表格分页 -->
<template>
  <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage"
    :page-sizes="[5, 10, 20, 50]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"
    background>
  </el-pagination>
</template>

<script setup>
const props = defineProps({
  total: {
    type: Number,
    required: true,
    default: 0
  },
  pageSize: {
    type: Number,
    required: true,
    default: 10
  },
  currentPage: {
    type: Number,
    required: true,
    default: 1
  }
})

const emit = defineEmits(['size-change', 'current-change'])

const handleSizeChange = (val) => {
  emit('size-change', val)
}

const handleCurrentChange = (val) => {
  emit('current-change', val)
}
</script>

<style scoped lang="scss">
.el-pagination {
  display: inline-flex;
  padding: 10px 0;
}
</style>